<template>
  <div>
    <section class="todoapp">
      <!-- 头部部分 -->
      <header class="header">
        <h1>todos</h1> 
        <input
          class="new-todo"
          placeholder="请输入任务名称"
          autofocus
          v-model.trim="todoName"
          @keyup.enter="addList"
        />
      </header>
    </section>
  </div>
</template>

<script>
export default {
  name: 'TodoTou',
  components: {},
  props: {},
  data() {
    return {
      todoName: '',
    }
  },
  computed: {},
  watch: {},
  created() {},
  methods: {
    addList() {
      if (!this.todoName) return alert('内容不能为空')
      this.$emit('addList', this.todoName)
      return (this.todoName = '')
    },
  },
}
</script>

<style scoped></style>
